<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:t="http://myfaces.apache.org/tomahawk">

	<ui:composition template="/template/pPrincipal.xhtml">

		<ui:define name="head">
			<title>BBVAITrade</title>
		</ui:define>

		<ui:define name="titulopagina">
			<p:toolbar>
				<p:toolbarGroup align="left" style="height: 20px;">
					<h:outputText value="MANTENIMIENTO MULTITABLA"
						styleClass="textoTituloPagina" />
				</p:toolbarGroup>
			</p:toolbar>
		</ui:define>

		<ui:define name="bodyarea">
			<p:messages id="growl" >
				<p:effect type="blind" event="load" delay="3000"/>
			</p:messages>
			<f:event type="preRenderView" listener="#{paramMultiTablaController.onPageLoad}"/>
			<p:accordionPanel multiple="true" activeIndex="0,1" id="idContentMain">
				<p:tab title="Filtro de Búsqueda">
					<h:panelGrid columns="2" style="margin-top: -30px">
						<p:spacer width="50" height="0" ></p:spacer>
						<p:spacer width="400" height="0" ></p:spacer>
						
						<h:outputText value="Tabla:" styleClass="texto" />
						<p:selectOneMenu value="#{paramMultiTablaController.descMultiTablaSeleccionado}" effect="fade" converter="multiTablaConverter">
				            <f:selectItem itemLabel="-- Seleccionar --" itemValue="-1" />
				            <f:selectItems value="#{paramMultiTablaController.listDescMultiTabla}"/>
				            <p:ajax event="change" listener="#{paramMultiTablaController.cargarListDataMultiTabla}" update=":formPrincipal:growl,:formPrincipal:idContentMain:idListDataMultiTabla,:formPrincipal:idContentMain:idButtoNew"/>
				        </p:selectOneMenu>	
					</h:panelGrid>
				</p:tab>
				<p:tab title="Resultado de Búsqueda">
					<p:dataTable value="#{paramMultiTablaController.listDataMultiTabla}" var="fila"
						paginator="true" rows="10" id="idListDataMultiTabla" editable="true">
						
						<p:ajax event="rowEdit" listener="#{paramMultiTablaController.onEdit}" 
							update=":formPrincipal:growl,:formPrincipal:idContentMain:idListDataMultiTabla"/>
						
						<p:column styleClass="columnCenter">
							<f:facet name="header">
								<h:outputText value="Id Tabla" />
							</f:facet>
							<h:outputText value="#{fila.idTabla}" />
						</p:column>
						<p:column styleClass="columnCenter">
							<f:facet name="header">
								<h:outputText value="Id Item" />
							</f:facet>
							<h:outputText value="#{fila.idItem}" />
						</p:column>
						<p:column headerText="Descripción">  
				            <p:cellEditor>  
				                <f:facet name="output">  
				                    <h:outputText value="#{fila.descripcion}"/>  
				                </f:facet>  
				                <f:facet name="input">  
				                    <p:inputText value="#{fila.descripcion}" maxlength="100"/>  
				                </f:facet>  
				            </p:cellEditor>  
				        </p:column>
				        <p:column headerText="Valor 1">  
				            <p:cellEditor>  
				                <f:facet name="output">  
				                    <h:outputText value="#{fila.valor1}"/>  
				                </f:facet>  
				                <f:facet name="input">  
				                    <p:inputText value="#{fila.valor1}" maxlength="20"/>  
				                </f:facet>  
				            </p:cellEditor>  
				        </p:column>
				        <p:column headerText="Valor 2">  
				            <p:cellEditor>  
				                <f:facet name="output">  
				                    <h:outputText value="#{fila.valor2}"/>  
				                </f:facet>  
				                <f:facet name="input">  
				                    <p:inputText value="#{fila.valor2}" maxlength="20"/>  
				                </f:facet>  
				            </p:cellEditor>  
				        </p:column>
						<p:column headerText="Compara 1">  
				            <p:cellEditor>  
				                <f:facet name="output">  
				                    <h:outputText value="#{fila.compara1}"/>  
				                </f:facet>  
				                <f:facet name="input">  
				                    <p:inputText value="#{fila.compara1}" maxlength="100"/>  
				                </f:facet>  
				            </p:cellEditor>  
				        </p:column>
						<p:column headerText="Compara 2">  
				            <p:cellEditor>  
				                <f:facet name="output">  
				                    <h:outputText value="#{fila.compara2}"/>  
				                </f:facet>  
				                <f:facet name="input">  
				                    <p:inputText value="#{fila.compara2}" maxlength="20"/>  
				                </f:facet>  
				            </p:cellEditor>  
				        </p:column>
				        <p:column headerText="Descripción Larga">
				            <p:cellEditor>  
				                <f:facet name="output">  
				                    <h:outputText value="#{fila.descripcionLarga}"/>  
				                </f:facet>  
				                <f:facet name="input">
				                	<p:inputTextarea value="#{fila.descripcionLarga}" rows="3" cols="30" maxlength="4000"/>
				                </f:facet>  
				            </p:cellEditor>  
				        </p:column>
				        <p:column headerText="Activo" style="width:50px">
				            <p:cellEditor>  
				                <f:facet name="output">  
				                    <h:outputText value="#{fila.indActivo}"/>  
				                </f:facet>  
				                <f:facet name="input">
				                	<h:selectOneMenu value="#{fila.indActivo}">  
							            <f:selectItem itemLabel="S" itemValue="S" />  
							            <f:selectItem itemLabel="N" itemValue="N" />
							        </h:selectOneMenu>
				                </f:facet>  
				            </p:cellEditor>  
				        </p:column>
						<p:column style="width:6%">  
				            <p:rowEditor />
            				<p:commandLink id="deleteLink" styleClass="ui-icon ui-icon-trash" actionListener="#{paramMultiTablaController.initVarFormDelete(fila.idCodigo)}" 
            					oncomplete="confirmationDetele.show()"/>
				        </p:column>
					</p:dataTable>
					<h:panelGroup id="idButtoNew">
						<p:commandButton value="Nuevo" rendered="#{paramMultiTablaController.showNewButton}" 
							actionListener="#{paramMultiTablaController.initVarFormSave}" oncomplete="popUpdateMultiTabla.show()" update=":idModalManMultiTabla"/>
					</h:panelGroup>
				</p:tab>
			</p:accordionPanel>
			
			<p:confirmDialog id="confirmDeleteDialog" message="¿Está seguro de eliminar la fila?"
                header="Eliminar" severity="alert" widgetVar="confirmationDetele">
		        <p:commandButton id="confirmDetele" value="Si" oncomplete="confirmationDetele.hide()" update=":formPrincipal:growl,:formPrincipal:idContentMain:idListDataMultiTabla"
		        	actionListener="#{paramMultiTablaController.deleteRowMultiTabla}"/>
		        <p:commandButton id="decline" value="No" onclick="confirmationDetele.hide()" type="button" />      
		    </p:confirmDialog>
		</ui:define>
		<ui:define name="extraarea">
			<ui:include src="/pages/parametria/include/popUpdateMultiTabla.xhtml" />
		</ui:define>
	</ui:composition>
</jsp:root>
